﻿@model System_Menu
@{
    ViewBag.Title = "MenuEdit";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="@Url.Content("~/Content/js/zTree_v3/js/jquery.ztree.all-3.5.min.js")"></script>
<div class="main-container">
    <div class="modal-form">
        <div class="modal-form-body">
            <form id="UserForm" method="post" class="form-horizontal margin10-t">
                @if (Model.Parent_ID != 0)
                {
                    <div class="contrl">
                        <label>菜单父节点：</label>
                        @Html.TextBox("parentName", ViewData["parentName"], new { @id = "parentName", @class = "input", @onclick = "showMenu();", @readonly = "readonly" })
                        <div class="clear"></div>
                    </div>
                }
                <div class="contrl">
                    <label>功能名称：</label>
                    @Html.TextBox("Menu_Name", Model.Menu_Name, new { @class = "input" })
                    @Html.Hidden("Parent_ID", Model.Parent_ID)
                    @Html.HiddenFor(m => Model.ID)
                    <div class="clear"></div>
                </div>
                <div class="contrl">
                    <label>功能类型：</label>
                    <div class="col-sm-offset-2 col-sm-10">
                        <div class="checkbox">
                            <label>
                                @Html.RadioButton("Menu_Type", 1, Model.Menu_Type == 1 ? true : false, new { @class = "select-item" })
                                功能模块
                            </label>
                            <label>
                                @Html.RadioButton("Menu_Type", 2, Model.Menu_Type == 2 ? true : false, new { @class = "select-item" })
                                功能菜单
                            </label>
                            <div class="clear"></div>
                        </div>
                    </div>
                </div>
                <div class="contrl">
                    <label>功能控制器：</label>
                    <input type="text" name="Menu_Controller" value="@Model.Menu_Controller" class="input">
                    <div class="clear"></div>
                </div>
                <div class="contrl">
                    <label>功能执行器：</label>
                    <input type="text" name="Menu_Action" value="@Model.Menu_Action" class="input">
                    <div class="clear"></div>
                </div>
                <div class="contrl">
                    <label>图标名称：</label>
                    <input type="text" name="Pictures_Name" value="@Model.Pictures_Name" class="input">
                    <div class="clear"></div>
                </div>
                <div class="contrl">
                    <label>是否启用：</label>
                    <div class="col-sm-offset-2 col-sm-10">
                        <div class="checkbox">
                            <label>
                                @Html.RadioButton("Is_Menu", 1, Model.Is_Menu == 1 ? true : false, new { @class = "select-item" })
                                启用
                            </label>
                            <label>
                                @Html.RadioButton("Is_Menu", 0, Model.Is_Menu == 0 ? true : false, new { @class = "select-item" })
                                停用
                            </label>
                            <div class="clear"></div>
                        </div>
                    </div>
                </div>
                <div class="contrl">
                    <label>菜单序号：</label>
                    <input type="text" name="Menu_Order" value="@Model.Menu_Order" class="input">
                    <div class="clear"></div>
                </div>
                <div class="contrl">
                    <label>备注说明：</label>
                    @Html.TextArea("Remark", Model.Remark, new { @class = "textarea" })
                    <div class="clear"></div>
                </div>
            </form>
        </div>
        <div class="modal-form-footer">
            <input type="button" class="btn-primary" value="保存" onclick="autoSubmit()" />
            <input type="button" class="btn-secondary" value="取消" onclick="CloseModelFrame()">
        </div>
    </div>
</div>
<div id="menuContent" class="menuContent" style="display: none; position: absolute; background-color: white">
    <ul id="treeDemo" class="ztree" style="margin-top: 0; width: 250px; height: 250px;"></ul>
</div>
<script type="text/javascript">
    var url = "/System/GetSystemTreeJson?menuId=0";
    var setting = {
        async: {
            enable: true,
            url: url,
            autoParam: ["id", "pId", "name"]
        },
        check: {

            enable: false,
            chkboxType: { "Y": "", "N": "" }
        },
        view: {
            dblClickExpand: false,
            showLine: true,
            showIcon: true
        },
        callback: {
            onClick: zTreeOnClick
        }
    };
    function showMenu() {
        var cityObj = $("#parentName");
        var cityOffset = $("#parentName").offset();
        $("#menuContent").css({ left: cityOffset.left + "px", top: cityOffset.top + cityObj.outerHeight() + "px" }).slideDown("fast");
        var zTree1 = $.fn.zTree.getZTreeObj("treeDemo");
        $("body").bind("mouseout", onBodyDown);
        zTree1.expandAll(true);
    }
    function zTreeOnClick(event, treeId, treeNode) {
        $("#parentName").val(treeNode.name);
        $("#Parent_ID").val(treeNode.id);
        hideMenu();
    }
    function hideMenu() {
        $("#menuContent").fadeOut("fast");
        $("body").unbind("mousedown", onBodyDown);
    }
    function onBodyDown(event) {
        if (!(event.target.id == "menuBtn" || event.target.id == "parentName" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length > 0)) {
            hideMenu();
        }
    }
    $(document).ready(function () {
        $.fn.zTree.init($("#treeDemo"), setting);
    });

    var t = true;
    function autoSubmit() {
        var postData = $("#UserForm").formSerialize();
        var url = "@Url.Action("MenuEdit", "System")";
        var options = {
            type: 'POST',
            data: postData,
            url: url,
            async: false,
            success: showResponse
        };
        if ($("#UserForm").validate().form()) {
            if (t) {
                t = false;
                $.ajax(options);
                t = true;
            }
        }
    }
    function showResponse(msg) {
        if (msg == 'y') {
            parent.layer.msg('保存成功！', { icon: 1, time: 700 }, function (v) {
                window.parent.location.reload(true);
            });
        } else {
            parent.layer.msg('操作不成功', { icon: 2 });
        }
    }

    //验证字段
    $(document).ready(function () {
        $("#UserForm").validate({
            rules: {
                Menu_Name: { required: true, maxlength: 50 },
                Menu_Controller: { required: true, maxlength: 100 },
                Menu_Action: { required: true, maxlength: 100 },
                Menu_Order: { required: true, number: true },
                Remark: { maxlength: 300 }
            },
            messages: {
                Menu_Name: {
                    required: "请输入功能名称",
                    maxlength: "功能长度最多50字"
                },
                Menu_Controller: {
                    required: "请输入功能控制器",
                    maxlength: "功能控制器长度最多100字"
                },
                Menu_Action: {
                    required: "请输入功能执行器",
                    maxlength: "功能执行器最多100字"
                },
                Menu_Order: {
                    required: "请输入菜单序号",
                    number: "请输入数据格式"
                },
                Remark: {
                    maxlength: "长度最多300字"
                }
            },
            errorElement: "em"
        });
    });
</script>
